<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            width: 100px;
            height: 100px;
        }
        #box1{
            border: 1px solid #000;
        }

        #box2{
            border:1px solid #000;
            border-radius:25px;
            -moz-border-radius:25px; /* Old Firefox */
        }

        #box3{
            border:1px solid #000;
            border-radius:25px;
            box-shadow: 10px 10px 5px #888888;
            -moz-border-radius:25px; /* Old Firefox */
        }

        #box4{
            width:400px;
            height:100px;
            border:10px double orange;
            -webkit-border-image:url(http://img.simoniu.com/css_border.png) 27 round;
            border-image:url(http://img.simoniu.com/css_border.png) 27 round;
        }

    </style>
</head>
<body>
<h1>边框的演示案例</h1>
<hr>

<div id="box1">
</div>

<br>

<div id="box2">
</div>
<br>
<div id="box3">
</div>
<br>
本身的边框素材：
<img src="http://img.simoniu.com/css_border.png">
<br>
<div id="box4">
</div>


</body>
</html>